<template>
	<div>
		<h4 class="title">职业技能培训</h4>
		<el-form ref="form" :model="form" label-width="80px">
			<el-form-item label="已选行业">
				<el-select v-model="form.region" placeholder="请选择活动区域">
					<el-option label="区域一" value="shanghai"></el-option>
					<el-option label="区域二" value="beijing"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="培训标题">
				<el-input v-model="form.name"></el-input>
			</el-form-item>
			<el-form-item label="培训内容">
				<el-input type="textarea" v-model="form.desc"></el-input>
			</el-form-item>
			<el-form-item label="培训对象">
				<el-radio-group v-model="form.resource">
					<el-radio label="人才"></el-radio>
					<el-radio label="企业"></el-radio>
				</el-radio-group>
			</el-form-item>
			<el-form-item>
				<el-transfer v-model="value1" :data="data" :titles="['所有对象', '已选对象']"></el-transfer>
			</el-form-item>
			<el-form-item label="培训状态">
				<el-select v-model="form.region" placeholder="请选择活动区域">
					<el-option label="区域一" value="shanghai"></el-option>
					<el-option label="区域二" value="beijing"></el-option>
				</el-select>
			</el-form-item>

			<el-form-item>
				<el-button @click='goback'>返回上一步</el-button>
				<el-button type="primary" @click="onSubmit">提交</el-button>

			</el-form-item>
		</el-form>
	</div>
</template>
<script type="text/javascript">
	export default {
		data() {
			const generateData = _ => {
				const data = [];
				for(let i = 1; i <= 15; i++) {
					data.push({
						key: i,
						label: `备选项 ${ i }`,
						disabled: i % 4 === 0
					});
				}
				return data;
			};
			return {
				form: {
					name: '',
					region: '',
					date1: '',
					date2: '',
					delivery: false,
					type: [],
					resource: '',
					desc: ''
				},
				data: generateData(),
				value1: [1, 4],
			}
		},
		created() {

		},
		methods: {
			goback() {
				this.$router.go(-1);
			},
			onSubmit() {
				this.$message({
					showClose: true,
					message: '提交成功',
					type: 'success'
				});

			}
		},
		mounted() {

		}
	}
</script>
<style lang="scss" scoped>

	.title {
		@include titlecenter;
	}
</style>